// JavaScript Document

function delayedInput(opt) {
	opt.time 	= opt.time || 400;
	opt.chars 	= opt.chars != null ? opt.chars : 3;
	opt.open 	= opt.open || function(){};
	opt.close 	= opt.close || function(){};
	opt.focus 	= opt.focus !== null ? opt.focus : false;
	
	var old 	= opt.elem.val();
	var open 	= false;
	
	setInterval(function(){
		var newValue = opt.elem.val();
		var len = old.length;
		if(old != newValue) {
			if(len < opt.chars && open) {
				opt.close();
				open = false;
			}
			else if(len >= opt.chars && len > 0) {
				opt.open(newValue, open);
				open = true;
			}
			old = newValue;
		}
	}, opt.time);
	
	opt.elem.onkeyup = function(){
		if(this.value.length == 0) {
			opt.close();
			open = false;
		}
	};
	
	if(opt.focus) {
		opt.elem.onblur = function() {
			if(open) {
				opt.close();
				open = false;
			}
		}
		
		opt.elem.focus = function() {
			if(this.value.length != 0 && !open) {
				opt.open('', open);
				open = true;
			}
		};
	}
}
/*
delayedInput({
	elem	: id("to"),
	chars	: 1,
	focus	: true,
	open	: function(q, open) {
		var w = trim(q.substr(q.lastIndexOf(',')+1, q.length));
		if( w ) {
			show(id("qloading"));
		}
	},
	close	: function() {
		hide(id("results"));
	}
});
*/

/*
li[i].onmouseover = function() {
	updatepos(this);
};

li[i].onclick = function() {
	addUser(this);
	id("to").focus();
};
*/
domReady = $(document).ready;

domReady(function(){
	hide(id("results"));
	var doneUsers = {};
	var curPos;
	var img = document.createElement("img");
	img.src = "loadingAnimation.gif";
	img.id = "qloading";

//	id("to").parentNode.insertBefore(img, id("to"));
	var div = document.createElement("div");
	div.id = "results";
	div.innerHTML = "<div class='suggest'>Suggestions:</div><ul></ul>";
	
	id("to").parent().append(div);
	id("to").keyup(function(e){
		var li = $("li", results);
		if(e.keyCode == 9 || e.keyCode == 13){
			loadDone();
			if(!doneUsers[curPos.id]){
				addUser(curPos);
			}
			e.preventDefault();
			return false;
		}
		
		else if(e.keyCode == 38) {
			return updatePos(curPos.previousSibling || li[li.length-1]);
		}
		
		else if(e.keyCode == 40) {
			return updatePos(curPos.nextSibling || li[0]);
		}
	});
	
	delayedInput({
		elem	: id("to"),
		chars	: 1,
		focus	: true,
		open	: function(q, open) {
			var w = trim(q.substr(q.lastIndexOf(',')+1, q.length));
			if( w ) {
				show(id("qloading"));
				curpos = null;
				var results = id("results :last-child");
				results.html("");

				$.post(
					 "search.php",
					 {data:'aaa'},
					 function(html) {
						 results.html(html);
						 loadDone();
						 var li = $("li", results);
						 for(var i = 0; i < li.length; i++) {
							 if(doneUsers[li[i].id]) {
								 $(li[i--]).remove();
//								 results.removeChild(li[i--]);
							 }
							 
							 else {
								 li[i].onmouseover = function() {
									 updatePos(this);
								 };
								 
								 li[i].onclick = function() {
									 addUser(this);
									 id("q").focus();
								 };
							 }
						 }
						 
						 if(li.length == 0) {
							 hide(id("results"));
						 }
						 else {
							 for(var i = 1; i < li.length; i += 2) {
								 $(li[i]).addClass("odd");
							 }
							 
							 updatePos(li[0]);
							 show(id("result"));
						 }
					 }
				);
			}
		},
		
		close	: function() {
			hide(id("result"));
		}
	});
	
	function trim(s) {
		return s.replace(/^\s+/, "").replace(/\s+$/, "");
	}
	
	function updatePos(elem) {
		curPos = elem;
		var li = $("li", results);
		for(var i = 0; i < li.length; i++) {
			$(li[i]).removeClass("cur");
		}
		
		$(curPos).addClass("cur");
		return false;
	}

	function loadDone() {
		doneUsers = {};

		var users = id("to").val().split(',');
		alert(users.length);
		for(var i = 0; i < users.length; i++) {
			doneUsers[trim(users[i].toLowerCase())] = true;
		}
	}

	function addUser(elem) {
		var v = id("to").val();
		id("to").value = 
			(v.indexOf(',') > 0 ? v.substr(0, v.lastIndexOf(',') + 2) : '') 
			+ elem.id + ", ";
		doneUsers[elem.id] = true;
		
		elem.parentNode.removeChild(elem);
		hide(id("result"));
	}
});

function id(id) {
	return $("#"+id);
}

function hide(elem) {
	return elem.hide();
}

function show(elem) {
	return elem.show();
}

function trim(val) {
	return val.trim();
}

function addClass(obj, classname) {
	return obj.addClass(classname);
}